<template>
  <div class="_75ce47e7">
    <main>
      <div class="_94d452dc">
        <section class="_2b1f4808 bg-white br3">
          <div class="_66e908c6">
            <div class="_98d1fd92 ">
              <div class="_0c4ed431">
                <div class="bac87ec6">
                  <div class="_83938fda">
                    <div class="_33c43af5">
                      <div class="e7114814">
                        <img src="@/assets/images/login/bear-big-eye.png"
                             class="_489835f0"><img
                        src="@/assets/images/login/bear-small-eye.png" class="fe2acb34"><img
                        src="@/assets/images/login/bear-smile-eye.png" class="_8fb7c421"></div>
                    </div>
                    <img src="@/assets/images/login/bear-body.png"></div>
                </div>
              </div>
            </div>
            <div class="ma0">
              <h2>Sign In</h2>
              <div class=" ">
                <label class="_64c2ccaf db mt1 mb2 f5 fw6 black-90 nowrap " >登录名</label>
                <input type="text"
                       class="_425fdea4 relative w-100 ma2 ml0 pv3 pl2 pr2 br2 black-70 ba b--black-10  "
                       name="username" placeholder="" v-model="loginInfo.username"></div>
              <div class=" ">
                <label class="_64c2ccaf db mt1 mb2 f5 fw6 black-90 nowrap ">密码</label>
                <input type="password"
                       required="" minlength="0"
                       class="_425fdea4 relative w-100 ma2 ml0 pv3 pl2 pr2 br2 black-70 ba b--black-10  "
                       name="password" placeholder="" v-model="loginInfo.credential"></div>
              <a-button style="width: 100%;margin-top: 20px" type="primary" @click="login">
                登录
              </a-button>
            </div>
          </div>
        </section>
      </div>
    </main>
  </div>
</template>

<script>
  import '@/assets/css/login/login.css'
  import { mapActions } from 'vuex'
  export default {
    name: "Login",
    data() {
      return {
        loginInfo: {
          username: '',
          credential: ''
        }
      }
    },
    created() {
      console.log(this.$route)
    },
    methods: {
      ...mapActions(['Login']),
      async login() {
        if (!this.loginInfo.username) {
          this.$me('请输入账户名')
          return;
        }
        if (!this.loginInfo.credential) {
          this.$me('请输入登录凭证')
          return;
        }
        const {Login} = this
        let res = await Login(this.loginInfo)
        if (res.success) {
          let redirect = this.$route.query.redirect
          if (!redirect) {
            redirect = '/'
          }
          this.$ms('登录成功', () => {
            this.$router.push(redirect)
          })
        } else {
          this.$me(res.message)
        }
      }
    }
  }
</script>

<style scoped>

</style>
